import GrimmCheckbox from '../Checkbox';
import { selectionBoxMixin } from '../../common/mixins/selectionBox';
const name = 'grimm-checkbox-group';
const childName = 'grimm-checkbox';
export default {
  name,
  mixins: [selectionBoxMixin],
  components: { GrimmCheckbox },
  props: {
    falseIcon: String,
    className: { default: name },
    name: { default: '' },
    trueIcon: String,
  },
  methods: {
    _onInnerClick(evt) {
      this.$emit('input', evt);
    },
  },
  render(h) {
    const children = this.options.map((option, idx) => {
      const props = Object.assign(Object.create(null), this.$props, {
        className: childName,
        label: option.label,
        name: option.value,
      });
      return h(childName, {
        on: {
          click: this._onInnerClick,
          input: val => this.$emit('input', val),
        },
        props,
        key: idx,
      });
    });
    return h('div', { class: name }, children);
  },
};
